import { addTruckOrderExtendFee } from '@/services/order/order_api';
import { ModalForm, ProForm, ProFormDigit, ProFormRadio, ProFormSelect, ProFormText } from '@ant-design/pro-components';
import { message } from 'antd';
import React, { useEffect, useState } from 'react';
import { FormattedMessage, useIntl } from 'umi';
import { TruckOrderFeeDetailVO } from '../../types'
import { get_map } from '@/services/system_api';



interface CreateModalProps {
    visible: boolean;
    onCancel: () => void;
    onSuccess: () => void;
    values?: Partial<TruckOrderFeeDetailVO>;
}

const formItemLayout = {
    labelCol: { span: 6 },
    wrapperCol: { span: 14 },
};
const EditForm: React.FC<CreateModalProps> = ({ visible, values, onCancel, onSuccess }) => {
    const [form] = ProForm.useForm<TruckOrderFeeDetailVO>();
    const intl = useIntl();
    const [initFeeTypes, setInitFeeTypes] = useState<any>([]);

    useEffect(() => {
        const fetchFeeOptions = async () => {
            await initFeeTypesFunc();
            // initClearData();
        };
        fetchFeeOptions();
    }, []);

    useEffect(() => {

        if (visible) {
            form.resetFields();
            // console.log(values)
            form.setFieldsValue({
                ...(values || {}),
                ofdAmount: undefined
            });

        }
    }, [visible, values]);

    const initFeeTypesFunc = async () => {
        try {
            const response = await get_map("elm_fee_types");
            if (response.code != 0) {
                if (!response.msg) {
                    throw new Error(intl.formatMessage({ id: "request.error.create" }));
                } else {
                    message.error(response.msg);
                }
            }
            setInitFeeTypes(response.data)
            // return response.data;
        } finally {
            // setLoading(false);
        }
    };


    const handleSubmit = async (formValues: TruckOrderFeeDetailVO) => {
        try {
            const response = await addTruckOrderExtendFee(formValues);
            if (response.code != 0) {
                message.error(intl.formatMessage({ id: 'request.error.operating' }) + response?.msg);
                return false;
            }

            message.success(intl.formatMessage({ id: 'request.success.operating' }));
            onSuccess();
            form.resetFields();
            return true;
        } catch (error) {
            message.error(intl.formatMessage({ id: 'request.error.retry' }));
            return false;
        }
    };

    return (
        <ModalForm<TruckOrderFeeDetailVO>
            title={values?.ofdId
                ? intl.formatMessage({ id: 'pages.edit' })
                : intl.formatMessage({ id: 'pages.truckOrder.feeNew' })}
            width={800}
            form={form}
            open={visible}
            onOpenChange={(visible) => !visible && onCancel()}
            onFinish={handleSubmit}
            autoFocusFirstInput
            modalProps={{
                destroyOnClose: true,
                maskClosable: false,
            }}
            submitter={{
                searchConfig: {
                    submitText: intl.formatMessage({ id: 'pages.button.submit' }),
                    resetText: intl.formatMessage({ id: 'pages.button.cancel' }),
                },
            }}
            layout="horizontal" {...formItemLayout}
        >
            <ProFormText
                name="orderCode"
                label={intl.formatMessage({ id: 'pages.truckOrder.orderCode' })}
                placeholder={intl.formatMessage({ id: 'pages.truckOrder.orderCode' })}
                rules={[{ required: true, message: intl.formatMessage({ id: 'pages.truckOrder.orderCode' }) }]}
                disabled
            />

            <ProFormText
                name="trackingNumber"
                label={intl.formatMessage({ id: 'pages.truckOrder.trackingNumber' })}
                placeholder={intl.formatMessage({ id: 'pages.truckOrder.trackingNumber' })}
                disabled
            />
            <ProFormText
                name="referenceNo"
                label={intl.formatMessage({ id: 'pages.truckOrder.referenceNo' })}
                placeholder={intl.formatMessage({ id: 'pages.truckOrder.referenceNo' })}
                disabled
            />

            <ProFormText
                name="customerCode"
                label={intl.formatMessage({ id: 'pages.truckOrder.customerCode' })}
                placeholder={intl.formatMessage({ id: 'pages.truckOrder.customerCode' })}
                disabled
            />

            <ProFormText
                name="productCode"
                label={intl.formatMessage({ id: 'pages.truckOrder.productCode' })}
                placeholder={intl.formatMessage({ id: 'pages.truckOrder.productCode' })}
                disabled
            />

            <ProFormText
                name="spCode"
                label={intl.formatMessage({ id: 'pages.truckOrder.spCode' })}
                placeholder={intl.formatMessage({ id: 'pages.truckOrder.spCode' })}
                disabled
            />

            <ProFormSelect
                name="ftCode"
                label={intl.formatMessage({ id: 'pages.truckOrder.feeCode' })}
                placeholder={intl.formatMessage({ id: 'pages.truckOrder.feeCode' })}
                rules={[{ required: true, message: intl.formatMessage({ id: 'pages.truckOrder.feeCode' }) }]}
                options={initFeeTypes}
            />


            <ProFormDigit
                name="ofdAmount"
                label={intl.formatMessage({ id: 'pages.truckOrder.feeValue' })}
                placeholder={intl.formatMessage({ id: 'pages.truckOrder.feeValue' })}
                rules={[{ required: true, message: intl.formatMessage({ id: 'pages.truckOrder.feeValue' }) }]}
                min={0}
                fieldProps={{ precision: 2 }}
            />

            <ProFormText
                name="currencyCode"
                label={intl.formatMessage({ id: 'pages.addForm.customer.customerCurrency' })}
                placeholder={intl.formatMessage({ id: 'pages.addForm.customer.customerCurrency' })}
                // rules={[{ required: true }]}
                disabled
            />

            <ProFormText
                name="ofdNote"
                label={intl.formatMessage({ id: 'pages.remark' })}
                placeholder={intl.formatMessage({ id: 'pages.remark' })}
                rules={[{ required: true }]}
            />

            {/* <ProFormText
            name="ofdSysNote"
            label={intl.formatMessage({ id: 'pages.systemRemark' })}
            placeholder={intl.formatMessage({ id: 'pages.systemRemark' })}
        /> */}


        </ModalForm>
    );
}

export default EditForm;